<template>
  <div>
    <el-row>
      <mu-appbar title="增加机器人" style="background-color:#409EFF">
        <mu-icon-button  icon="arrow_back_ios" slot="left" :to="{name: 'GmMenu' }"/>
      </mu-appbar>
    </el-row>

    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="游戏">
        <el-select v-model="form.gameId" placeholder="请选择">
           <el-option
             v-for="item in optionsGameId"
             :key="item.value"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-form-item>

      <el-form-item label="机器人等级">
        <el-select v-model="form.level" placeholder="请选择">
           <el-option
             v-for="item in optionsLevel"
             :key="item.value"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-form-item>

      <el-form-item label="数量">
        <el-input v-model="form.num"></el-input>
      </el-form-item>

      <el-form-item label="基础概率">
        <el-input v-model="form.basePro"></el-input>
      </el-form-item>

      <el-form-item label="开始时间">
        <el-input v-model="form.openStartTime"></el-input>
      </el-form-item>

      <el-form-item label="结束时间">
        <el-input v-model="form.openEndTime"></el-input>
      </el-form-item>

      <el-form-item label="性格">
        <el-select v-model="form.trait" placeholder="请选择">
           <el-option
             v-for="item in optionsTrait"
             :key="item.value"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-form-item>

      <el-form-item label="类型">
        <el-select v-model="form.type" placeholder="请选择">
           <el-option
             v-for="item in optionsType"
             :key="item.value"
             :label="item.label"
             :value="item.value">
           </el-option>
         </el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import Qs from 'qs'
  export default {
    data() {
      return {
        form: {
          gameId: 201,
          level: 1,
          num: 1,
          basePro: 50,
          openStartTime: 0,
          openEndTime: 0,
          trait: 1,
          type: 1
        },
        optionsGameId: [
          {
            value: 201,
            label: '大米'
          },
          {
            value: 202,
            label: '小米'
          },
          {
            value: 203,
            label: '89'
          }
        ],
        optionsLevel: [
          {
            value: 1,
            label: '低级'
          },
          {
            value: 2,
            label: '普通'
          },
          {
            value: 3,
            label: '高级'
          }
        ],
        optionsTrait: [
          {
            value: 1,
            label: '急躁'
          },
          {
            value: 2,
            label: '标准'
          },
          {
            value: 3,
            label: '耐心'
          }
        ],
        optionsType: [
          {
            value: 1,
            label: '阶段1类型'
          },
          {
            value: 2,
            label: '阶段2类型'
          },
        ]
      }
    },
    methods: {
      onSubmit() {
        if (this.verifyNumber(this.form.num) && this.verifyNumber(this.form.openStartTime) && this.verifyNumber(this.form.openEndTime)) {
          const loading = this.$loading({
            lock: true,
            text: '创建中...',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          })
          let data = Qs.stringify(this.form)
          this.$axios({
            method: 'post',
            url: '/api/GmService.addRobot',
            data
          })
          .then(response => {
            loading.close()
            if(response.data.status === 'success') {
              this.$message.success('创建成功')
            } else {
              this.$message.error(response.data.cause)
            }
          })
          .catch(e => {
            loading.close()
            this.$message.error('创建失败')
          })
        } else {
          this.$message.error('参数必须为正整数')
        }
      },
      verifyNumber (val) {
        return !isNaN(val) && val >= 0 && val % 1 === 0
      }
    },
    mounted() {

    }
  }
</script>
